<!-- build time:Tue Nov 03 2020 20:13:59 GMT+0800 (GMT+08:00) --><!DOCTYPE html><html class="theme-next pisces use-motion" lang="zh-CN"><head><meta name="generator" content="Hexo 3.9.0"><meta charset="UTF-8"><meta http-equiv="X-UA-Compatible" content="IE=edge"><meta name="viewport" content="width=device-width,initial-scale=1,maximum-scale=2"><meta name="theme-color" content="#222"><link rel="stylesheet" href="//cdnjs.cloudflare.com/ajax/libs/Han/3.3.0/han.min.css"><meta name="google-site-verification" content="U349XOYHFCgkEOYhTP4YlFqqyEq_f7zA8B4ERY7tWXA"><meta name="baidu-site-verification" content="APKb23AsyK"><link rel="stylesheet" href="//cdn.bootcss.com/fancybox/3.5.6/jquery.fancybox.min.css"><link rel="stylesheet" href="/blog/lib/font-awesome/css/font-awesome.min.css?v=4.6.2"><link rel="stylesheet" href="/blog/css/main.css?v=7.1.2"><link rel="apple-touch-icon" sizes="180x180" href="/blog/images/apple-touch-icon-next.png?v=7.1.2"><link rel="icon" type="image/png" sizes="32x32" href="/blog/icos/favicon-48x48.ico?v=7.1.2"><link rel="icon" type="image/png" sizes="16x16" href="/blog/icos/favicon-32x32.ico?v=7.1.2"><link rel="mask-icon" href="/blog/images/logo.svg?v=7.1.2" color="#222"><script id="hexo.configurations">var NexT=window.NexT||{},CONFIG={root:"/blog/",scheme:"Pisces",version:"7.1.2",sidebar:{position:"left",display:"post",offset:12,onmobile:!1,dimmer:!1},back2top:!0,back2top_sidebar:!1,fancybox:!0,fastclick:!0,lazyload:!0,tabs:!0,motion:{enable:!0,async:!0,transition:{post_block:"fadeIn",post_header:"slideDownIn",post_body:"slideDownIn",coll_header:"slideLeftIn",sidebar:"slideUpIn"}},algolia:{applicationID:"",apiKey:"",indexName:"",hits:{per_page:10},labels:{input_placeholder:"Search for Posts",hits_empty:"We didn't find any results for the search: ${query}",hits_stats:"${hits} results found in ${time} ms"}}}</script><meta name="description" content="原文作者：cherry原文地址：【基础】利用 hexo + Gitpage 开发自己的博客进入程序员这个坑之后就开始自己在网上扒资料，然而资料太多，情况太复杂，主要是看见别人的博客，感觉好高大上，并且感觉在茫茫的互联网有自己的小天地感觉也是极好的。不是为了给别人看，而是为了 记录自己的成长，记录自己的每一个脚印。"><meta name="keywords" content="Hexo建站,Githubpages"><meta property="og:type" content="article"><meta property="og:title" content="【基础】利用 hexo + Gitpage 开发自己的博客"><meta property="og:url" content="https://liliuzhu.gitee.io/blog/2019/03/gitpage+hexo_develop_blog.html"><meta property="og:site_name" content="Luther Li&#39;s Blog"><meta property="og:description" content="原文作者：cherry原文地址：【基础】利用 hexo + Gitpage 开发自己的博客进入程序员这个坑之后就开始自己在网上扒资料，然而资料太多，情况太复杂，主要是看见别人的博客，感觉好高大上，并且感觉在茫茫的互联网有自己的小天地感觉也是极好的。不是为了给别人看，而是为了 记录自己的成长，记录自己的每一个脚印。"><meta property="og:locale" content="zh-CN"><meta property="og:image" content="https://liliuzhu.github.io/CDN/images/blog/2019/16058c198562f9ec.jpg"><meta property="og:updated_time" content="2020-05-07T09:22:10.551Z"><meta name="twitter:card" content="summary"><meta name="twitter:title" content="【基础】利用 hexo + Gitpage 开发自己的博客"><meta name="twitter:description" content="原文作者：cherry原文地址：【基础】利用 hexo + Gitpage 开发自己的博客进入程序员这个坑之后就开始自己在网上扒资料，然而资料太多，情况太复杂，主要是看见别人的博客，感觉好高大上，并且感觉在茫茫的互联网有自己的小天地感觉也是极好的。不是为了给别人看，而是为了 记录自己的成长，记录自己的每一个脚印。"><meta name="twitter:image" content="https://liliuzhu.github.io/CDN/images/blog/2019/16058c198562f9ec.jpg"><link rel="alternate" href="/blog/atom.xml" title="Luther Li's Blog" type="application/atom+xml"><link rel="canonical" href="https://liliuzhu.gitee.io/blog/2019/03/gitpage+hexo_develop_blog"><script id="page.configurations">CONFIG.page={sidebar:""}</script><title>【基础】利用 hexo + Gitpage 开发自己的博客 | Luther Li's Blog</title><script>var _hmt=_hmt||[];!function(){var e=document.createElement("script");e.src="https://hm.baidu.com/hm.js?2a46638d9d90d8e9e8bd06f78263ffa4";var t=document.getElementsByTagName("script")[0];t.parentNode.insertBefore(e,t)}()</script><noscript><style>.sidebar-inner,.use-motion .brand,.use-motion .collection-title,.use-motion .comments,.use-motion .menu-item,.use-motion .motion-element,.use-motion .pagination,.use-motion .post-block,.use-motion .post-body,.use-motion .post-header{opacity:initial}.use-motion .logo,.use-motion .site-subtitle,.use-motion .site-title{opacity:initial;top:initial}.use-motion .logo-line-before i{left:initial}.use-motion .logo-line-after i{right:initial}</style></noscript></head><body itemscope itemtype="http://schema.org/WebPage" lang="zh-CN"><div class="container sidebar-position-left page-post-detail"><div class="headband"></div><header id="header" class="header" itemscope itemtype="http://schema.org/WPHeader"><div class="header-inner"><div class="site-brand-wrapper"><div class="site-meta"><div class="custom-logo-site-title"><a href="/blog/" class="brand" rel="start"><span class="logo-line-before"><i></i></span> <span class="site-title">Luther Li's Blog</span> <span class="logo-line-after"><i></i></span></a></div><p class="site-subtitle">越努力，越精彩</p></div><div class="site-nav-toggle"><button aria-label="切换导航栏"><span class="btn-bar"></span> <span class="btn-bar"></span> <span class="btn-bar"></span></button></div></div><nav class="site-nav"><ul id="menu" class="menu"><li class="menu-item menu-item-home"><a href="/blog/" rel="section"><i class="menu-item-icon fa fa-fw fa-home"></i><br>首页</a></li><li class="menu-item menu-item-about"><a href="/blog/about/" rel="section"><i class="menu-item-icon fa fa-fw fa-user"></i><br>关于</a></li><li class="menu-item menu-item-tags"><a href="/blog/tags/" rel="section"><i class="menu-item-icon fa fa-fw fa-tags"></i><br>标签</a></li><li class="menu-item menu-item-categories"><a href="/blog/categories/" rel="section"><i class="menu-item-icon fa fa-fw fa-th"></i><br>分类</a></li><li class="menu-item menu-item-archives"><a href="/blog/archives/" rel="section"><i class="menu-item-icon fa fa-fw fa-archive"></i><br>归档</a></li><li class="menu-item menu-item-search"><a href="javascript:;" class="popup-trigger"><i class="menu-item-icon fa fa-search fa-fw"></i><br>搜索</a></li></ul><div class="site-search"><div class="popup search-popup local-search-popup"><div class="local-search-header clearfix"><span class="search-icon"><i class="fa fa-search"></i> </span><span class="popup-btn-close"><i class="fa fa-times-circle"></i></span><div class="local-search-input-wrapper"><input autocomplete="off" placeholder="搜索..." spellcheck="false" type="text" id="local-search-input"></div></div><div id="local-search-result"></div></div></div></nav></div></header><a href="https://github.com/liliuzhu" class="github-corner" title="Follow me on GitHub" aria-label="Follow me on GitHub" rel="noopener" target="_blank"><svg width="80" height="80" viewbox="0 0 250 250" aria-hidden="true"><path d="M0,0 L115,115 L130,115 L142,142 L250,250 L250,0 Z"/><path d="M128.3,109.0 C113.8,99.7 119.0,89.6 119.0,89.6 C122.0,82.7 120.5,78.6 120.5,78.6 C119.2,72.0 123.4,76.3 123.4,76.3 C127.3,80.9 125.5,87.3 125.5,87.3 C122.9,97.6 130.6,101.9 134.4,103.2" fill="currentColor" style="transform-origin:130px 106px" class="octo-arm"/><path d="M115.0,115.0 C114.9,115.1 118.7,116.5 119.8,115.4 L133.7,101.6 C136.9,99.2 139.9,98.4 142.2,98.6 C133.8,88.0 127.5,74.4 143.8,58.0 C148.5,53.4 154.0,51.2 159.7,51.0 C160.3,49.4 163.2,43.6 171.4,40.1 C171.4,40.1 176.1,42.5 178.8,56.2 C183.1,58.6 187.2,61.8 190.9,65.4 C194.5,69.0 197.7,73.2 200.1,77.6 C213.8,80.2 216.3,84.9 216.3,84.9 C212.7,93.1 206.9,96.0 205.4,96.6 C205.1,102.4 203.0,107.8 198.3,112.5 C181.9,128.9 168.3,122.5 157.7,114.1 C157.9,116.9 156.7,120.9 152.7,124.9 L141.0,136.5 C139.8,137.7 141.6,141.9 141.8,141.8 Z" fill="currentColor" class="octo-body"/></svg></a><main id="main" class="main"><div class="main-inner"><div class="content-wrap"><div id="content" class="content"><div id="posts" class="posts-expand"><article class="post post-type-normal" itemscope itemtype="http://schema.org/Article"><div class="post-block"><link itemprop="mainEntityOfPage" href="https://liliuzhu.gitee.io/blog/blog/2019/03/gitpage+hexo_develop_blog.html"><span hidden itemprop="author" itemscope itemtype="http://schema.org/Person"><meta itemprop="name" content="Luther Li"><meta itemprop="description" content="本人前端菜鸟一枚，踏在前端这条不归路上<br/>渐行渐远..."><meta itemprop="image" content="/blog/uploads/avatar.jpg"></span><span hidden itemprop="publisher" itemscope itemtype="http://schema.org/Organization"><meta itemprop="name" content="Luther Li's Blog"></span><header class="post-header"><h1 class="post-title" itemprop="name headline">【基础】利用 hexo + Gitpage 开发自己的博客</h1><div class="post-meta"><span class="post-time"><span class="post-meta-item-icon"><i class="fa fa-calendar-o"></i> </span><span class="post-meta-item-text">发表于</span> <time title="创建时间：2019-03-06 11:52:12" itemprop="dateCreated datePublished" datetime="2019-03-06T11:52:12Z">2019-03-06</time> <span class="post-meta-divider">|</span> <span class="post-meta-item-icon"><i class="fa fa-calendar-check-o"></i> </span><span class="post-meta-item-text">更新于</span> <time title="修改时间：2020-05-07 09:22:10" itemprop="dateModified" datetime="2020-05-07T09:22:10Z">2020-05-07</time> </span><span class="post-category"><span class="post-meta-divider">|</span> <span class="post-meta-item-icon"><i class="fa fa-folder-o"></i> </span><span class="post-meta-item-text">分类于</span> <span itemprop="about" itemscope itemtype="http://schema.org/Thing"><a href="/blog/categories/Hexo/" itemprop="url" rel="index"><span itemprop="name">Hexo</span></a></span> ， <span itemprop="about" itemscope itemtype="http://schema.org/Thing"><a href="/blog/categories/转载/" itemprop="url" rel="index"><span itemprop="name">转载</span></a></span> </span><span class="post-comments-count"><span class="post-meta-divider">|</span> <span class="post-meta-item-icon"><i class="fa fa-comment-o"></i> </span><span class="post-meta-item-text">评论数：</span> <a href="/blog/2019/03/gitpage+hexo_develop_blog.html#comments" itemprop="discussionUrl"><span class="post-comments-count valine-comment-count" data-xid="/blog/2019/03/gitpage+hexo_develop_blog.html" itemprop="commentCount"></span> </a></span><span id="/blog/2019/03/gitpage+hexo_develop_blog.html" class="leancloud_visitors" data-flag-title="【基础】利用 hexo + Gitpage 开发自己的博客"><span class="post-meta-divider">|</span> <span class="post-meta-item-icon"><i class="fa fa-eye"></i> </span><span class="post-meta-item-text">阅读次数：</span> <span class="leancloud-visitors-count"></span></span><div class="post-symbolscount"><span class="post-meta-item-icon"><i class="fa fa-file-word-o"></i> </span><span class="post-meta-item-text">本文字数：</span> <span title="本文字数">15k</span> <span class="post-meta-divider">|</span> <span class="post-meta-item-icon"><i class="fa fa-clock-o"></i> </span><span class="post-meta-item-text">阅读时长 &asymp;</span> <span title="阅读时长">25 分钟</span></div></div></header><div class="post-body han-init-context" itemprop="articleBody"><div class="post-gallery" itemscope itemtype="http://schema.org/ImageGallery"><div class="post-gallery-row"><img src="//liliuzhu.github.io/CDN/images/blog/2019/16058c198562f9ec.jpg" itemprop="contentUrl"></div></div><blockquote><ul><li>原文作者：<a href="https://cherryblog.site" target="_blank" rel="noopener">cherry</a></li><li>原文地址：<a href="https://cherryblog.site/Use-Gitpagehexo-to-develop-their-own-blog.html" target="_blank" rel="noopener">【基础】利用 hexo + Gitpage 开发自己的博客</a></li></ul></blockquote><p>进入程序员这个坑之后就开始自己在网上扒资料，然而资料太多，情况太复杂，主要是看见别人的博客，感觉好高大上，并且感觉在茫茫的互联网有自己的小天地感觉也是极好的。不是为了给别人看，而是为了 记录自己的成长，记录自己的每一个脚印。</p><a id="more"></a><h2 id="Gitpage-hexo"><a href="#Gitpage-hexo" class="headerlink" title="Gitpage+hexo"></a>Gitpage+hexo</h2><p>想要实现拥有一个独立的私有博客，我们需要两个东西，一个是可供浏览器访问的静态网页存储空间，这个我们选择gitPage，一个是一个静态网页生成工具，Octopress也好，Hexo也罢，这里我选择的是Hexo。</p><h1 id="环境准备"><a href="#环境准备" class="headerlink" title="环境准备"></a>环境准备</h1><h2 id="1-安装Node"><a href="#1-安装Node" class="headerlink" title="1 安装Node"></a>1 安装Node</h2><p>到Node.js官网下载相应平台的最新版本，一路安装即可。我用的是node-v0.10.22-x86.msi</p><h2 id="2-安装Git"><a href="#2-安装Git" class="headerlink" title="2 安装Git"></a>2 安装Git</h2><p>安装git，或安装github客户端，自我感觉github客户端很好用，界面很友好，同样操作起来也比git好用的多！我用的是window10系统，在官网下载数次都未安装成功，最后在知乎上终于找到安装包，链接: <a href="http://pan.baidu.com/s/1eS2mHxS" target="_blank" rel="noopener">http://pan.baidu.com/s/1eS2mHxS</a> 密码: yatq ，有需要的同学可以点击下载。</p><h1 id="安装步骤"><a href="#安装步骤" class="headerlink" title="安装步骤"></a>安装步骤</h1><h2 id="1-安装Hexo"><a href="#1-安装Hexo" class="headerlink" title="1 安装Hexo"></a>1 安装Hexo</h2><p>使用git shell,依次输入以下代码命令：</p><figure class="highlight stata"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br></pre></td><td class="code"><pre><span class="line"><span class="keyword">cd</span> /</span><br><span class="line">npm install hexo-<span class="keyword">cli</span> -<span class="keyword">g</span></span><br></pre></td></tr></table></figure><p>命令解释：</p><p><strong>cd和/之间要有空格</strong>，这条指令的作用是返回根目录，也可以在cd /后加入一个文件名，例如下文要用到的cd /Hexo 就可以指向这个文件夹，再输入代码行就默认在在此文件下执行。</p><h2 id="2-安装博客所需文件"><a href="#2-安装博客所需文件" class="headerlink" title="2 安装博客所需文件"></a>2 安装博客所需文件</h2><figure class="highlight verilog"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br><span class="line">6</span><br></pre></td><td class="code"><pre><span class="line">cd /</span><br><span class="line">hexo init Hexo</span><br><span class="line">cd /Hexo</span><br><span class="line">npm instal</span><br><span class="line">hexo <span class="keyword">generate</span>（可简写为hexo g）</span><br><span class="line">hexo sever（可简写为hexo s）</span><br></pre></td></tr></table></figure><p>命令解释:</p><ul><li><p>cd /这里返回的根目录取决于你在github客户端的设置，我设置的是F盘，所以返回得也是F盘，所以下面创建的Hexo文件夹也在F盘。</p></li><li><p>Hexo这个文件名可以随便命名，存放的是构建博客所要用到的所有文件。</p></li><li><p>指向Hexo目录</p></li><li><p>安装依赖文件</p></li><li><p>编译</p></li><li><p>开启本地服务(第5、6步的操作可以合并成hexo s -g)</p></li></ul><p>此时打开浏览器，在地址栏输入<a href="http://localhost:4000/" target="_blank" rel="noopener">http://localhost:4000/</a><br>即可查看博客的原型，是不是看到了胜利的曙光；但是如果“显示无法访问此网站”也不要沮丧，我这步是直接看到页面的，你无法访问的原因可能你没有翻墙，因为页面中默认使用了ajax.google.com 下的js包。</p><p>那么如何翻墙呢？ 下面提供我所知道的两种方法：</p><p>这种方法比较简单，下载安装运行Lantern，可以官网下载的吧！这里提供一下安装包吧，链接: <a href="http://pan.baidu.com/s/1c2x7eRu" target="_blank" rel="noopener">http://pan.baidu.com/s/1c2x7eRu</a><br>密码: z3kw</p><p>这种方法需要修改hosts文件，我的 hosts 文件路径：C:\Windows\System32\drivers\etc ，详细攻略：<a href="http://blog.my-eclipse.cn/host-google.html" target="_blank" rel="noopener">http://blog.my-eclipse.cn/host-google.html</a></p><p>如果你不想翻墙，可以采用这种方法：<br>进入你刚新建好的 blog根目录</p><figure class="highlight awk"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><span class="line">themes<span class="regexp">/landscape/</span>layout<span class="regexp">/_partial</span></span><br></pre></td></tr></table></figure><p>1，找到 after-footer.ejs把</p><figure class="highlight apache"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><span class="line"><span class="section">&lt;script src="http://cdn.bootcss.com/jquery/2.1.1/jquery.min.js“ &gt;</span> <span class="section">&lt;/script&gt;</span></span><br></pre></td></tr></table></figure><p>替换成</p><blockquote><p><code>&lt;script src=&quot;http://cdn.bootcss.com/jquery/2.1.1/jquery.min.js“ &gt; &lt;/script&gt;</code></p></blockquote><p>2，找到 header.ejs<br>注释掉或者删掉 下面这句css引用<br><code>&lt;link href=&quot;//fonts.googleapis.com/css?family=Source+Code+Pro&quot; rel=”stylesheet” type=”text/css”&gt;</code><br>hexo server 之后。访问 <a href="http://localhost:4000" target="_blank" rel="noopener">http://localhost:4000</a> 就会看到blog主页了。</p><p>如果你成功在<a href="http://localhost:4000/" target="_blank" rel="noopener">http://localhost:4000/</a><br>下看到了博客原型，那么再进行一些简单的操作之后就可以马上拥有自己的博客了，是不是很激动！</p><blockquote><p>行百里者半九十</p></blockquote><p>不到成功的那一刻，一切欣喜若狂都是不值得的！如果你已经迫不及待，我们继续：</p><h2 id="3-部署博客到服务器"><a href="#3-部署博客到服务器" class="headerlink" title="3 部署博客到服务器"></a>3 部署博客到服务器</h2><p>也就是把博客部署到github page提供的服务器上。</p><p>步骤</p><ul><li>首先回到git shell按ctrl+c，之后输入y即可</li></ul><ul><li>修改Hexo文件夹下_config.yml文件，如下图所示修改，repository后的地址要改成你自己的地址：<code>deploy: type: github repo: https://github.com/yourname/blog.git</code></li></ul><p>继续回到git shell输入命令：</p><figure class="highlight stata"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br></pre></td><td class="code"><pre><span class="line">hexo clean</span><br><span class="line">hexo <span class="keyword">g</span></span><br><span class="line">hexo <span class="built_in">s</span></span><br><span class="line">hexo <span class="built_in">d</span></span><br></pre></td></tr></table></figure><p>命令解释:</p><ul><li>清除public，当 source 文件夹中的部分资源更改过之后，特别是对文件进行了删除或者路径的改变之后，需要执行这个命令，然后重新编译。<br>编译，一般部署上去的时候都需要编译一下，编译后，会出现一个 public 文件夹，将所有的md文件编译成html文件</li><li>开启本地服务，</li><li>部署博客到github上，如果一切顺利，你就通过访问usename.github.io访问你的博客了！<br>是的，现在你拥有了自己的博客！</li></ul><h1 id="发表博文"><a href="#发表博文" class="headerlink" title="发表博文"></a>发表博文</h1><p>千辛万苦建立了博客，那么我们来学习一下如何发表博文。</p><h2 id="新建博文"><a href="#新建博文" class="headerlink" title="新建博文"></a>新建博文</h2><p>继续回到git shell输入：</p><p>hexo new “新博文的名字”<br>即可在 Hexo\source_posts 目录中找到”新博文的名字.md”这个文件。你就可以使用maekdown编辑器打开进行编写博客内容了。</p><p><strong>Markdown编辑器</strong></p><p>推荐两款我所使用的markdown编辑器：</p><p><strong>MIU</strong>，据说是仿mac版的mou，界面相当友好，非常喜欢，官网都下载不了，挺小众，可能我就是典型的少说派，我也是偶然间得到，在此提供下载地址：<br>链接: <a href="http://pan.baidu.com/s/1slMPeTR" target="_blank" rel="noopener">http://pan.baidu.com/s/1slMPeTR</a><br>密码: 2pnk<br><strong>正在使用的Atom:</strong>更为先进的文本代码编辑器 ,由 Github 打造的下一代编程开发神器,其中支持markdown。<br>可能会遇到的问题</p><blockquote><p>hexo new [layout] “postName” #新建文章</p></blockquote><p>其中layout是可选参数，默认值为post。有哪些layout呢，请到scaffolds目录下查看，这些文件名称就是layout名称。当然你可以添加自己的layout，方法就是添加一个文件即可，同时你也可以编辑现有的layout，比如post的layout默认是hexo\scaffolds\post.md</p><figure class="highlight yaml"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br></pre></td><td class="code"><pre><span class="line"><span class="attr">title:</span> <span class="string">&#123;</span> <span class="string">&#123;</span> <span class="string">title</span> <span class="string">&#125;</span> <span class="string">&#125;</span></span><br><span class="line"><span class="attr">date:</span> <span class="string">&#123;</span> <span class="string">&#123;</span> <span class="string">date</span> <span class="string">&#125;</span> <span class="string">&#125;</span></span><br><span class="line"><span class="attr">tags:</span></span><br><span class="line"><span class="meta">---</span></span><br></pre></td></tr></table></figure><p>大括号与大括号之间我多加了个空格，否则会被转义，不能正常显示。<br>我想添加categories，以免每次手工输入，只需要修改这个文件添加一行</p><figure class="highlight yaml"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br></pre></td><td class="code"><pre><span class="line"><span class="attr">title:</span> <span class="string">&#123;</span> <span class="string">&#123;</span> <span class="string">title</span> <span class="string">&#125;</span> <span class="string">&#125;</span></span><br><span class="line"><span class="attr">date:</span> <span class="string">&#123;</span> <span class="string">&#123;</span> <span class="string">date</span> <span class="string">&#125;</span> <span class="string">&#125;</span></span><br><span class="line"><span class="attr">categories:</span></span><br><span class="line"><span class="attr">tags:</span></span><br><span class="line"><span class="meta">---</span></span><br></pre></td></tr></table></figure><p>postName是md文件的名字，同时也出现在你文章的URL中，postName如果包含空格，必须用”将其包围，postName可以为中文。</p><p>注意，所有文件：后面都必须有个空格，不然会报错。</p><p>看一下刚才生成的文件hexo\source_posts\postName.md</p><figure class="highlight yaml"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br></pre></td><td class="code"><pre><span class="line"><span class="attr">title:</span> <span class="string">postName</span> <span class="comment">#文章页面上的显示名称，可以任意修改，不会出现在URL中</span></span><br><span class="line"><span class="attr">date:</span> <span class="number">2013</span><span class="bullet">-12</span><span class="bullet">-02</span> <span class="number">15</span><span class="string">:30:16</span> <span class="comment">#文章生成时间，一般不改，当然也可以任意修改</span></span><br><span class="line"><span class="attr">categories:</span> <span class="comment">#文章分类目录，可以为空，注意:后面有个空格</span></span><br><span class="line"><span class="attr">tags:</span> <span class="comment">#文章标签，可空，多标签请用格式[tag1,tag2,tag3]，注意:后面有个空格</span></span><br><span class="line"><span class="meta">---</span></span><br></pre></td></tr></table></figure><p>始使用markdown格式输入你的正文。，你就可以用喜爱的编辑器尽情书写你的文章。关于markdown语法，可以参考我的文章Markdown简明语法。</p><p><strong>fancybox</strong><br>可能有人对这个Reading页面中图片的fancybox效果感兴趣，这个是怎么做的呢。<br>很简单，只需要在你的文章*.md文件的头上添加photos项即可，然后一行行添加你要展示的照片：<br></p><figure class="highlight subunit"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br><span class="line">6</span><br><span class="line">7</span><br></pre></td><td class="code"><pre><span class="line">layout: photo</span><br><span class="line">title: 我的阅历</span><br><span class="line">date: 2085<span class="string">-01</span><span class="string">-16</span> 07:33:44</span><br><span class="line"><span class="keyword">tags:</span> [hexo]</span><br><span class="line">photos:</span><br><span class="line">- http://bruce.u.qiniudn.com/2013/11/27/reading/photos<span class="string">-0</span>.jpg</span><br><span class="line">- http://bruce.u.qiniudn.com/2013/11/27/reading/photos<span class="string">-1</span>.jpg</span><br></pre></td></tr></table></figure><p></p><p>经过测试，文件头上的layout: photo可以省略。</p><p>不想每次都手动添加怎么办？同样的，打开您的hexo\scaffolds\photo.md<br></p><figure class="highlight yaml"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br><span class="line">6</span><br><span class="line">7</span><br></pre></td><td class="code"><pre><span class="line"><span class="attr">layout:</span> <span class="string">&#123;</span> <span class="string">&#123;</span> <span class="string">layout</span> <span class="string">&#125;</span> <span class="string">&#125;</span></span><br><span class="line"><span class="attr">title:</span> <span class="string">&#123;</span> <span class="string">&#123;</span> <span class="string">title</span> <span class="string">&#125;</span> <span class="string">&#125;</span></span><br><span class="line"><span class="attr">date:</span> <span class="string">&#123;</span> <span class="string">&#123;</span> <span class="string">date</span> <span class="string">&#125;</span> <span class="string">&#125;</span></span><br><span class="line"><span class="attr">tags:</span></span><br><span class="line"><span class="attr">photos:</span></span><br><span class="line"><span class="bullet">-</span></span><br><span class="line"><span class="meta">---</span></span><br></pre></td></tr></table></figure><p></p><p>然后每次可以执行带layout的new命令生成照片文章：</p><figure class="highlight haxe"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><span class="line">hexo <span class="keyword">new</span> <span class="type">photo</span> <span class="string">"photoPostName"</span> <span class="meta">#新建照片文章</span></span><br></pre></td></tr></table></figure><p>description<br>markdown文件头中也可以添加description，以覆盖全局配置文件中的description内容，请参考下文_config.yml的介绍。<br></p><figure class="highlight yaml"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br><span class="line">6</span><br></pre></td><td class="code"><pre><span class="line"><span class="attr">title:</span> <span class="string">hexo你的博客</span></span><br><span class="line"><span class="attr">date:</span> <span class="number">2013</span><span class="bullet">-11</span><span class="bullet">-22</span> <span class="number">17</span><span class="string">:11:54</span></span><br><span class="line"><span class="attr">categories:</span> <span class="string">default</span></span><br><span class="line"><span class="attr">tags:</span> <span class="string">[hexo]</span></span><br><span class="line"><span class="attr">description:</span> <span class="string">你对本页的描述</span></span><br><span class="line"><span class="meta">---</span></span><br></pre></td></tr></table></figure><p></p><p>hexo默认会处理全部markdown和html文件，如果不想让hexo处理你的文件，可以在文件头中加入layout: false。</p><p><strong>文章摘要</strong><br>在需要显示摘要的地方添加如下代码即可：</p><figure class="highlight xml"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br></pre></td><td class="code"><pre><span class="line">以上是摘要</span><br><span class="line"><span class="comment">&lt;!--more--&gt;</span></span><br><span class="line">以下是余下全文</span><br></pre></td></tr></table></figure><p>more以上内容即是文章摘要，在主页显示，more以下内容点击『&gt; Read More』链接打开全文才显示。</p><p>hexo中所有文件的编码格式均是UTF-8。</p><h2 id="优雅的在博客上插入图片"><a href="#优雅的在博客上插入图片" class="headerlink" title="优雅的在博客上插入图片"></a>优雅的在博客上插入图片</h2><p>看到很多博客上说使用七牛，但是这种方法可能是用着最爽的，我们来看一下如何使用：</p><p>首先确认 _config.yml 中更改 post_asset_folder:true 。<br>回到git shell，输入</p><p>npm install <a href="https://github.com/CodeFalling/hexo-asset-image" target="_blank" rel="noopener">https://github.com/CodeFalling/hexo-asset-image</a> –save</p><p>继续执行</p><figure class="highlight stata"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br></pre></td><td class="code"><pre><span class="line">hexo clean</span><br><span class="line">hexo <span class="keyword">g</span></span><br><span class="line">hexo <span class="built_in">s</span></span><br><span class="line">hexo <span class="built_in">d</span></span><br></pre></td></tr></table></figure><p>重新创建一个博客名字，然后发现Hexo\source_posts下多了一个与博客名字相同的空文件夹</p><p>然后就可以把我们博客中要用到的图片存放在这个文件夹下，需要时直接引用即可，是不是特别方便？<br>提醒：</p><p>写一篇博文时尽量只使用一种markdown编辑器，如果同时使用两个编辑器，我感觉不同编辑器对markdown语法的编译还是有一些差别的，用这个编辑器写好的格式用另一个编辑器打开却乱了！</p><h2 id="预览和发表"><a href="#预览和发表" class="headerlink" title="预览和发表"></a>预览和发表</h2><p>继续重复以下命令即可实现预览和发表，恭喜你已经在自己建设的博客网站上发表了第一篇博文！</p><figure class="highlight markdown"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br></pre></td><td class="code"><pre><span class="line"><span class="bullet">1.  </span>hexo clean</span><br><span class="line"><span class="bullet">2.  </span>hexo g</span><br><span class="line"><span class="bullet">3.  </span>hexo s</span><br><span class="line"><span class="bullet">4.  </span>hexo d</span><br></pre></td></tr></table></figure><p>更高大上的发表博文的方法</p><p>使用Travis CI自动部署你的Hexo博客到Github,请参考<a href="http://i.woblog.cn/2016/05/04/%E6%89%8B%E6%8A%8A%E6%89%8B%E6%95%99%E4%BD%A0%E4%BD%BF%E7%94%A8Travis%20CI%E8%87%AA%E5%8A%A8%E9%83%A8%E7%BD%B2%E4%BD%A0%E7%9A%84Hexo%E5%8D%9A%E5%AE%A2%E5%88%B0Github%E4%B8%8A/#more" target="_blank" rel="noopener">手把手教你使用Travis CI自动部署你的Hexo博客到Github上</a></p><p>使用could9在线更新博客，这样的话即使更换了电脑，也能优雅的更新博客了。详细请参考：用c9.io实现在线更新博客</p><h2 id="安装主题"><a href="#安装主题" class="headerlink" title="安装主题"></a>安装主题</h2><p>如果你跟我一样觉得原始的博客主题很low，想更换一个高逼格的，那我们继续往下进行：</p><p>选择主题</p><p>你可以在<a href="https://github.com/hexojs/hexo/wiki/Themes" target="_blank" rel="noopener">Themes·Hexo</a>上选择你喜欢的主题，我使用的Next主题</p><h2 id="安装Next主题"><a href="#安装Next主题" class="headerlink" title="安装Next主题"></a>安装Next主题</h2><p>参考<a href="http://theme-next.iissnan.com/getting-started.html" target="_blank" rel="noopener">Next官方文档</a>,内容十分详尽！</p><p>安装主题的方法就是一句git命令：</p><figure class="highlight crmsh"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><span class="line">git <span class="keyword">clone</span> <span class="title">https</span>://github.com/heroicyang/hexo-theme-modernist.git themes/modernist</span><br></pre></td></tr></table></figure><p>目录是否是modernist无所谓，只要与_config.yml文件一致即可。</p><p>安装完成后，打开hexo_config.yml，修改主题为modernist</p><figure class="highlight avrasm"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><span class="line"><span class="symbol">theme:</span> modernist</span><br></pre></td></tr></table></figure><p>打开hexo\themes\modernist目录，编辑主题配置文件_config.yml：</p><figure class="highlight yaml"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br><span class="line">6</span><br><span class="line">7</span><br><span class="line">8</span><br><span class="line">9</span><br><span class="line">10</span><br><span class="line">11</span><br><span class="line">12</span><br><span class="line">13</span><br><span class="line">14</span><br><span class="line">15</span><br><span class="line">16</span><br><span class="line">17</span><br><span class="line">18</span><br><span class="line">19</span><br><span class="line">20</span><br><span class="line">21</span><br><span class="line">22</span><br><span class="line">23</span><br><span class="line">24</span><br><span class="line">25</span><br><span class="line">26</span><br><span class="line">27</span><br><span class="line">28</span><br><span class="line">29</span><br></pre></td><td class="code"><pre><span class="line"><span class="attr">menu:</span> <span class="comment">#配置页头显示哪些菜单</span></span><br><span class="line"><span class="comment">#  Home: /</span></span><br><span class="line"><span class="attr">  Archives:</span> <span class="string">/archives</span></span><br><span class="line"><span class="attr">  Reading:</span> <span class="string">/reading</span></span><br><span class="line"><span class="attr">  About:</span> <span class="string">/about</span></span><br><span class="line"><span class="comment">#  Guestbook: /about</span></span><br><span class="line"></span><br><span class="line"><span class="attr">excerpt_link:</span> <span class="string">Read</span> <span class="string">More</span> <span class="comment">#摘要链接文字</span></span><br><span class="line"><span class="attr">archive_yearly:</span> <span class="literal">false</span> <span class="comment">#按年存档</span></span><br><span class="line"></span><br><span class="line"><span class="attr">widgets:</span> <span class="comment">#配置页脚显示哪些小挂件</span></span><br><span class="line"><span class="bullet">  -</span> <span class="string">category</span></span><br><span class="line"><span class="comment">#  - tag</span></span><br><span class="line"><span class="bullet">  -</span> <span class="string">tagcloud</span></span><br><span class="line"><span class="bullet">  -</span> <span class="string">recent_posts</span></span><br><span class="line"><span class="comment">#  - blogroll</span></span><br><span class="line"></span><br><span class="line"><span class="attr">blogrolls:</span> <span class="comment">#友情链接</span></span><br><span class="line"><span class="bullet">  -</span> <span class="string">bruce</span> <span class="string">sha's</span> <span class="string">duapp</span> <span class="attr">wordpress:</span> <span class="attr">http://ibruce.duapp.com</span></span><br><span class="line"><span class="bullet">  -</span> <span class="string">bruce</span> <span class="string">sha's</span> <span class="attr">javaeye:</span> <span class="attr">http://buru.iteye.com</span></span><br><span class="line"><span class="bullet">  -</span> <span class="string">bruce</span> <span class="string">sha's</span> <span class="string">oschina</span> <span class="attr">blog:</span> <span class="attr">http://my.oschina.net/buru</span></span><br><span class="line"><span class="bullet">  -</span> <span class="string">bruce</span> <span class="string">sha's</span> <span class="string">baidu</span> <span class="attr">space:</span> <span class="attr">http://hi.baidu.com/iburu</span></span><br><span class="line"></span><br><span class="line"><span class="attr">fancybox:</span> <span class="literal">true</span> <span class="comment">#是否开启fancybox效果</span></span><br><span class="line"></span><br><span class="line"><span class="attr">duoshuo_shortname:</span> <span class="string">buru</span> <span class="comment">#多说账号</span></span><br><span class="line"></span><br><span class="line"><span class="attr">google_analytics:</span></span><br><span class="line"><span class="attr">rss:</span></span><br></pre></td></tr></table></figure><p>更新主题</p><figure class="highlight bash"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br></pre></td><td class="code"><pre><span class="line"><span class="built_in">cd</span> themes/modernist</span><br><span class="line">git pull</span><br></pre></td></tr></table></figure><h2 id="评论框"><a href="#评论框" class="headerlink" title="评论框"></a>评论框</h2><p>静态博客要使用第三方评论系统，hexo默认集成的是Disqus，因为你懂的，所以国内的话还是建议用<a href="https://hexo.io/plugins/" target="_blank" rel="noopener">多说</a><br>直接用你的微博/豆瓣/人人/百度/开心网帐号登录多说，做一下基本设置。如果使用modernist主题，在modernist_config.yml中配置duoshuo_shortname为多说的基本设置-&gt;域名中的shortname即可。你也可以在多说后台自定义一下多说评论框的格式，比如评论框的位置，对于css设置，可以<a href="http://dev.duoshuo.com/docs/4ff1cfd0397309552c000017" target="_blank" rel="noopener">参考这里</a>，我是在HeroicYang的基础上修改的。</p><p>如果你是有的其他第三方评论系统，将通用代码粘贴到hexo\themes\modernist\layout_partial\comment.ejs里面，如下：</p><figure class="highlight erb"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br></pre></td><td class="code"><pre><span class="line"><span class="xml"><span class="tag">&lt;<span class="name">%</span></span></span><span class="ruby"> <span class="keyword">if</span> (config.disqus_shortname &amp;&amp; page.comments)&#123; </span><span class="xml"><span class="tag">%&gt;</span></span></span><br><span class="line"><span class="xml"><span class="tag">&lt;<span class="name">section</span> <span class="attr">id</span>=<span class="string">"comment"</span>&gt;</span></span></span><br><span class="line"><span class="xml">  #你的通用代码</span></span><br><span class="line"><span class="xml"><span class="tag">&lt;<span class="name">%</span></span></span><span class="ruby"> &#125; </span><span class="xml"><span class="tag">%&gt;</span></span></span><br></pre></td></tr></table></figure><h2 id="构建新页面"><a href="#构建新页面" class="headerlink" title="构建新页面"></a>构建新页面</h2><p>那些小图标都是一个新页面，需要手动创建，那么如何创建？</p><p>回到git shell，</p><p>hexo new page “页面名称”<br>比如你要创建一个about页面，就输入hexo new page “about”</p><p>正确显示各页面内容</p><p>发表博文后发现点击上面建立的页面后发现是空白页，比如，打开标签页面，发现是空白，或者提示找不到！</p><p>解决方法：以标签页为例，打开Hexo\source\tags下index.md文件，修改如下：</p><p>comments: false即关闭此页面的评论功能</p><p>type: “tags”这里的值根据你想更改的页面决定</p><p>更改过后，在重新部署到github上，你就可以点击各个页面查看，发现一切都是那么美好！</p><h2 id="安装插件"><a href="#安装插件" class="headerlink" title="安装插件"></a>安装插件</h2><p>hexo支持的插件：<a href="https://hexo.io/plugins/" target="_blank" rel="noopener">Plugins | Hexo</a><br>想安装什么插件，按照相关README.md中介绍操作即可。</p><p>安装多说评论、不蒜子（或LeanCloud）和分享插件，参考:<a href="http://theme-next.iissnan.com/third-party-services.html#swfitype" target="_blank" rel="noopener">第三方服务集成</a>，介绍非常全面！好好用来装饰你的博客吧！</p><p>安装sitemap和feed插件时，如果遇到问题，可以参考:<a href="http://www.imys.net/20150513/wordpress-to-hexo.html#%E6%97%A0%E6%B3%95%E5%BC%80%E5%90%AFRSS%E5%92%8Csitemap" target="_blank" rel="noopener">博客搬迁记 - 从WordPress到Hexo</a>，安装sitemap后要到<a href="http://zhanzhang.baidu.com/?castk=LTE=" target="_blank" rel="noopener">百度站长</a>提交你的网站，首先要添加站点，然后在链接提交你的sitemap.xml，详细操作参考:<a href="http://www.gfwsb.com/2016/use-sitemap-for-hexo/" target="_blank" rel="noopener">为Hexo博客生成sitemap</a></p><p>安装swiftype插件，如果遇到问题，可以参考<a href="http://www.jerryfu.net/post/search-engine-for-hexo-with-swiftype-v2.html" target="_blank" rel="noopener">利用swiftype为hexo添加站内搜索</a></p><h2 id="图床"><a href="#图床" class="headerlink" title="图床"></a>图床</h2><p>考虑到博客的速度，同时也为了便于博客的迁移，图床是必须的。我墙裂推荐七牛，访问速度极快，支持日志、防盗链和水印。</p><p>免费用户有每月10GB流量+总空间10GB+PUT/DELETE 10万次请求+GET 100万次请求，这对个人博客来说足够，有一点要说明的是，七牛没有目录的概念，但是文件名可以包含/，比如2013/11/27/reading/photos-0.jpg，参考这里<a href="https://support.qiniu.com/hc/" target="_blank" rel="noopener">关于key-value存储系统</a>。</p><p>七牛除了作为图床还可以作为其他静态文件存储空间，比如我的个人站点首页有个字库文件和JS文件下载较慢，有时间会把它弄到七牛上去，以提高首页打开速度。请看这篇<a href="https://linux.cn/article-2311-1.html" target="_blank" rel="noopener">Linux中国采用七牛云存储支撑图片访问</a>。</p><p>如果非要说不足的话，就是文件管理界面不是很友好，不支持CNAME到分配的永久链接，也不能绑定未备案的自有域名，必须备案才可以。</p><p>如果你对七牛web版的文件管理界面不满意，可以用官方的<a href="http://docs.qiniu.com/tools/v6/index.html" target="_blank" rel="noopener">七牛云存储工具</a>。</p><p>您还可以使用如下图床服务 FarBox，Dropbox，又拍云</p><h2 id="主题优化"><a href="#主题优化" class="headerlink" title="主题优化"></a>主题优化</h2><p>Next主题很美观，个人也非常喜欢，但是一点令我们烦恼的就是主题加载的特别缓慢，那怎么优化呢？请参考一下两篇博文，作者已经总结的非常详细了，有需要的可以拜读一下，受益匪浅！</p><p><a href="http://www.gfwsb.com/2016/improveNexTspeed/" target="_blank" rel="noopener">提升Hexo的NexT主题加载速度</a></p><p><a href="http://www.5941740.cn/2016/02/19/%E4%BD%BF%E7%94%A8gulp%E7%B2%BE%E7%AE%80hexo%E5%8D%9A%E5%AE%A2%E4%BB%A3%E7%A0%81/" target="_blank" rel="noopener">使用gulp精简hexo博客代码</a></p><h2 id="绑定域名"><a href="#绑定域名" class="headerlink" title="绑定域名"></a>绑定域名</h2><p>购买域名，我是在<a href="https://account.aliyun.com/login/login.htm?oauth_callback=http://netcn.console.aliyun.com/core/domain/tclist" target="_blank" rel="noopener">万网</a>购买的，可以申请到国际域名，免去了备案的繁杂过程，我居然申请了两个，由于自学前端，所以就构建了一个网站来展示自己写的一些demo，【至于如何快速的构建一个网站，从购买域名，云空间到上传文件，你可以试一下这个<a href="http://www.xiaoerguo.com/" target="_blank" rel="noopener">网站</a>,但是现在可以用github page做服务器，也可以构建多个项目主页来展现demo，是我马上要研究的方向，自己上传云服务器感觉步骤好繁琐，看一下在github建立项目主页能否得到改善！】还一个正好闲置着，所以就拿来解析到github page上，以后就可以通过自己的域名访问自己的博客了！</p><p>如何操作：在 Hexo\source 文件夹里新建一个名为 CNAME 的文件，用文本编辑器打开，添加内容 yourwebsite.com （你的个人域名 ）。保存后，部署你的博客即可。如果这步遇到问题，也可手动在万网上解析，github page提供的IP：</p><p>192.30.252.153</p><p>192.30.252.154</p><h2 id="制作ICO图标"><a href="#制作ICO图标" class="headerlink" title="制作ICO图标"></a>制作ICO图标</h2><p>favicon.ico一般用于作为缩略图的网站标志，<a href="http://www.bitbug.net/" target="_blank" rel="noopener">在线制作网站</a><br>关于是否绑定域名</p><p>经过这几天的试用，关于是否绑定域名，发表一下自己的看法，如果你仅仅是使用个人主页来托管个人博客。绑定与否看你自己的想法，如果你还想使用github的项目主页来展示平时写的一些小练习demo，那我劝你不要绑定个人域名了，关于如何使用github的项目主页，请参考<a href="http://chitanda.me/2015/11/03/multiple-git-pages-in-one-github-account/" target="_blank" rel="noopener">单个GitHub帐号下添加多个GitHub Pages的相关问题</a>,这样你就可以直接在需要展示的项目下添加gh-pages分支，然后通过访问“用户名。github.io/项目名/*.html”来查看页面展示效果了。这多方便，不用自己在上传云空间了，省去了一堆麻烦事！</p><p>#至此，基本操作介绍完毕，以下内容普通用户无需了解。<br>默认目录结构：<br></p><figure class="highlight gradle"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br><span class="line">6</span><br><span class="line">7</span><br><span class="line">8</span><br><span class="line">9</span><br><span class="line">10</span><br><span class="line">11</span><br></pre></td><td class="code"><pre><span class="line">.</span><br><span class="line">├── .deploy</span><br><span class="line">├── <span class="keyword">public</span></span><br><span class="line">├── scaffolds</span><br><span class="line">├── scripts</span><br><span class="line">├── <span class="keyword">source</span></span><br><span class="line">|   ├── _drafts</span><br><span class="line">|   └── _posts</span><br><span class="line">├── themes</span><br><span class="line">├── _config.yml</span><br><span class="line">└── <span class="keyword">package</span>.json</span><br></pre></td></tr></table></figure><p></p><ul><li>deploy：执行hexo deploy命令部署到GitHub上的内容目录</li><li>public：执行hexo generate命令，输出的静态网页内容目录</li><li>scaffolds：layout模板文件目录，其中的md文件可以添加编辑</li><li>scripts：扩展脚本目录，这里可以自定义一些javascript脚本</li><li>source：文章源码目录，该目录下的markdown和html文件均会被hexo处理。该页面对应repo的根目录，404文件、favicon.ico文件，CNAME文件等都应该放这里，该目录下可新建页面目录。<ul><li>drafts：草稿文章</li><li>posts：发布文章</li></ul></li><li>themes：主题文件目录</li><li>_config.yml：全局配置文件，大多数的设置都在这里</li><li>package.json：应用程序数据，指明hexo的版本等信息，类似于一般软件中的关于按钮</li></ul><p>接下来是重头戏_config.yml，做个简单说明：<br></p><figure class="highlight yaml"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br><span class="line">6</span><br><span class="line">7</span><br><span class="line">8</span><br><span class="line">9</span><br><span class="line">10</span><br><span class="line">11</span><br><span class="line">12</span><br><span class="line">13</span><br><span class="line">14</span><br><span class="line">15</span><br><span class="line">16</span><br><span class="line">17</span><br><span class="line">18</span><br><span class="line">19</span><br><span class="line">20</span><br><span class="line">21</span><br><span class="line">22</span><br><span class="line">23</span><br><span class="line">24</span><br><span class="line">25</span><br><span class="line">26</span><br><span class="line">27</span><br><span class="line">28</span><br><span class="line">29</span><br><span class="line">30</span><br><span class="line">31</span><br><span class="line">32</span><br><span class="line">33</span><br><span class="line">34</span><br><span class="line">35</span><br><span class="line">36</span><br><span class="line">37</span><br><span class="line">38</span><br><span class="line">39</span><br><span class="line">40</span><br><span class="line">41</span><br><span class="line">42</span><br><span class="line">43</span><br><span class="line">44</span><br><span class="line">45</span><br><span class="line">46</span><br><span class="line">47</span><br><span class="line">48</span><br><span class="line">49</span><br><span class="line">50</span><br><span class="line">51</span><br><span class="line">52</span><br><span class="line">53</span><br><span class="line">54</span><br><span class="line">55</span><br><span class="line">56</span><br><span class="line">57</span><br><span class="line">58</span><br><span class="line">59</span><br><span class="line">60</span><br><span class="line">61</span><br><span class="line">62</span><br><span class="line">63</span><br><span class="line">64</span><br><span class="line">65</span><br><span class="line">66</span><br><span class="line">67</span><br><span class="line">68</span><br><span class="line">69</span><br><span class="line">70</span><br><span class="line">71</span><br><span class="line">72</span><br><span class="line">73</span><br><span class="line">74</span><br><span class="line">75</span><br><span class="line">76</span><br><span class="line">77</span><br><span class="line">78</span><br><span class="line">79</span><br><span class="line">80</span><br><span class="line">81</span><br><span class="line">82</span><br><span class="line">83</span><br><span class="line">84</span><br><span class="line">85</span><br></pre></td><td class="code"><pre><span class="line"><span class="comment"># Hexo Configuration</span></span><br><span class="line"><span class="comment">## Docs: http://zespia.tw/hexo/docs/configure.html</span></span><br><span class="line"><span class="comment">## Source: https://github.com/tommy351/hexo/</span></span><br><span class="line"></span><br><span class="line"><span class="comment"># Site #整站的基本信息</span></span><br><span class="line"><span class="attr">title:</span> <span class="string">不如</span> <span class="comment">#网站标题</span></span><br><span class="line"><span class="attr">subtitle:</span> <span class="string">码农，程序猿，未来的昏析师</span> <span class="comment">#网站副标题</span></span><br><span class="line"><span class="attr">description:</span> <span class="string">bruce</span> <span class="string">sha's</span> <span class="string">blog</span> <span class="string">| java | scala | bi #网站描述，给搜索引擎用的，在生成html中的head-&gt;meta中可看到</span></span><br><span class="line"><span class="string"></span><span class="attr">author:</span> <span class="string">bruce</span> <span class="comment">#网站作者，在下方显示</span></span><br><span class="line"><span class="attr">email:</span> <span class="string">bu.ru@qq.com</span> <span class="comment">#联系邮箱</span></span><br><span class="line"><span class="attr">language:</span> <span class="string">zh-CN</span> <span class="comment">#语言</span></span><br><span class="line"></span><br><span class="line"><span class="comment"># URL #域名和文件结构</span></span><br><span class="line"><span class="comment">## If your site is put in a subdirectory, set url as 'http://yoursite.com/child' and root as '/child/'</span></span><br><span class="line"><span class="attr">url:</span> <span class="attr">http://ibruce.info</span> <span class="comment">#你的域名</span></span><br><span class="line"><span class="attr">root:</span> <span class="string">/</span></span><br><span class="line"><span class="attr">permalink:</span> <span class="string">:year/:month/:day/:title/</span></span><br><span class="line"><span class="attr">tag_dir:</span> <span class="string">tags</span></span><br><span class="line"><span class="attr">archive_dir:</span> <span class="string">archives</span></span><br><span class="line"><span class="attr">category_dir:</span> <span class="string">categories</span></span><br><span class="line"><span class="attr">code_dir:</span> <span class="string">downloads/code</span></span><br><span class="line"></span><br><span class="line"><span class="comment"># Writing #写文章选项</span></span><br><span class="line"><span class="attr">new_post_name:</span> <span class="string">:title.md</span> <span class="comment"># File name of new posts</span></span><br><span class="line"><span class="attr">default_layout:</span> <span class="string">post</span> <span class="comment">#默认layout方式</span></span><br><span class="line"><span class="attr">auto_spacing:</span> <span class="literal">false</span> <span class="comment"># Add spaces between asian characters and western characters</span></span><br><span class="line"><span class="attr">titlecase:</span> <span class="literal">false</span> <span class="comment"># Transform title into titlecase</span></span><br><span class="line"><span class="attr">external_link:</span> <span class="literal">true</span> <span class="comment"># Open external links in new tab</span></span><br><span class="line"><span class="attr">max_open_file:</span> <span class="number">100</span></span><br><span class="line"><span class="attr">multi_thread:</span> <span class="literal">true</span></span><br><span class="line"><span class="attr">filename_case:</span> <span class="number">0</span></span><br><span class="line"><span class="attr">render_drafts:</span> <span class="literal">false</span></span><br><span class="line"><span class="attr">highlight:</span> <span class="comment">#代码高亮</span></span><br><span class="line"><span class="attr">  enable:</span> <span class="literal">true</span> <span class="comment">#是否启用</span></span><br><span class="line"><span class="attr">  line_number:</span> <span class="literal">false</span> <span class="comment">#是否显示行号</span></span><br><span class="line"><span class="attr">  tab_replace:</span></span><br><span class="line"></span><br><span class="line"><span class="comment"># Category &amp; Tag #分类与标签</span></span><br><span class="line"><span class="attr">default_category:</span> <span class="string">uncategorized</span> <span class="comment"># default</span></span><br><span class="line"><span class="attr">category_map:</span></span><br><span class="line"><span class="attr">tag_map:</span></span><br><span class="line"></span><br><span class="line"><span class="comment"># Archives #存档，这里的说明好像不对。全部选择1，这个选项与主题中的选项有时候会有冲突</span></span><br><span class="line"><span class="comment">## 2: Enable pagination</span></span><br><span class="line"><span class="comment">## 1: Disable pagination</span></span><br><span class="line"><span class="comment">## 0: Fully Disable</span></span><br><span class="line"><span class="attr">archive:</span> <span class="number">1</span></span><br><span class="line"><span class="attr">category:</span> <span class="number">1</span></span><br><span class="line"><span class="attr">tag:</span> <span class="number">1</span></span><br><span class="line"></span><br><span class="line"><span class="comment"># Server #本地服务参数</span></span><br><span class="line"><span class="comment">## Hexo uses Connect as a server</span></span><br><span class="line"><span class="comment">## You can customize the logger format as defined in</span></span><br><span class="line"><span class="comment">## http://www.senchalabs.org/connect/logger.html</span></span><br><span class="line"><span class="attr">port:</span> <span class="number">4000</span></span><br><span class="line"><span class="attr">logger:</span> <span class="literal">true</span></span><br><span class="line"><span class="attr">logger_format:</span></span><br><span class="line"></span><br><span class="line"><span class="comment"># Date / Time format #日期显示格式</span></span><br><span class="line"><span class="comment">## Hexo uses Moment.js to parse and display date</span></span><br><span class="line"><span class="comment">## You can customize the date format as defined in</span></span><br><span class="line"><span class="comment">## http://momentjs.com/docs/#/displaying/format/</span></span><br><span class="line"><span class="attr">date_format:</span> <span class="string">MMM</span> <span class="string">D</span> <span class="string">YYYY</span></span><br><span class="line"><span class="attr">time_format:</span> <span class="attr">H:mm:ss</span></span><br><span class="line"></span><br><span class="line"><span class="comment"># Pagination #分页设置</span></span><br><span class="line"><span class="comment">## Set per_page to 0 to disable pagination</span></span><br><span class="line"><span class="attr">per_page:</span> <span class="number">10</span> <span class="comment">#每页10篇文章</span></span><br><span class="line"><span class="attr">pagination_dir:</span> <span class="string">page</span></span><br><span class="line"></span><br><span class="line"><span class="comment"># Disqus #社会化评论disqus，我使用多说，在主题中配置</span></span><br><span class="line"><span class="attr">disqus_shortname:</span></span><br><span class="line"></span><br><span class="line"><span class="comment"># Extensions #插件，暂时未安装插件</span></span><br><span class="line"><span class="comment">## Plugins: https://github.com/tommy351/hexo/wiki/Plugins</span></span><br><span class="line"><span class="comment">## Themes: https://github.com/tommy351/hexo/wiki/Themes</span></span><br><span class="line"><span class="comment">## 主题</span></span><br><span class="line"><span class="attr">theme:</span> <span class="string">modernist</span> <span class="comment"># raytaylorism # pacman # modernist # light</span></span><br><span class="line"><span class="attr">exclude_generator:</span></span><br><span class="line"></span><br><span class="line"><span class="comment"># Deployment #部署</span></span><br><span class="line"><span class="comment">## Docs: http://zespia.tw/hexo/docs/deploy.html</span></span><br><span class="line"><span class="attr">deploy:</span></span><br><span class="line"><span class="attr">  type:</span> <span class="string">github</span></span><br><span class="line"><span class="attr">  repository:</span> <span class="string">git@github.com:bruce-sha/bruce-sha.github.com.git</span> <span class="comment">#你的GitHub Pages仓库</span></span><br></pre></td></tr></table></figure><p></p><h2 id="修改局部页面"><a href="#修改局部页面" class="headerlink" title="修改局部页面"></a>修改局部页面</h2><p>页面展现的全部逻辑都在每个主题中控制，源代码在hexo\themes\你使用的主题\中，以modernist主题为例：<br></p><figure class="highlight glsl"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br><span class="line">6</span><br><span class="line">7</span><br><span class="line">8</span><br><span class="line">9</span><br><span class="line">10</span><br><span class="line">11</span><br><span class="line">12</span><br><span class="line">13</span><br><span class="line">14</span><br><span class="line">15</span><br><span class="line">16</span><br><span class="line">17</span><br><span class="line">18</span><br></pre></td><td class="code"><pre><span class="line">.</span><br><span class="line">├── languages          <span class="meta">#多语言</span></span><br><span class="line">|   ├── <span class="keyword">default</span>.yml    <span class="meta">#默认语言</span></span><br><span class="line">|   └── zh-CN.yml      <span class="meta">#中文语言</span></span><br><span class="line">├── <span class="keyword">layout</span>             <span class="meta">#布局，根目录下的*.ejs文件是对主页，分页，存档等的控制</span></span><br><span class="line">|   ├── _partial       <span class="meta">#局部的布局，此目录下的*.ejs是对头尾等局部的控制</span></span><br><span class="line">|   └── _widget        <span class="meta">#小挂件的布局，页面下方小挂件的控制</span></span><br><span class="line">├── source             <span class="meta">#源码</span></span><br><span class="line">|   ├── css            <span class="meta">#css源码</span></span><br><span class="line">|   |   ├── _base      <span class="meta">#*.styl基础css</span></span><br><span class="line">|   |   ├── _partial   <span class="meta">#*.styl局部css</span></span><br><span class="line">|   |   ├── fonts      <span class="meta">#字体</span></span><br><span class="line">|   |   ├── images     <span class="meta">#图片</span></span><br><span class="line">|   |   └── style.styl <span class="meta">#*.styl引入需要的css源码</span></span><br><span class="line">|   ├── fancybox       <span class="meta">#fancybox效果源码</span></span><br><span class="line">|   └── js             <span class="meta">#javascript源代码</span></span><br><span class="line">├── _config.yml        <span class="meta">#主题配置文件</span></span><br><span class="line">└── README.md          <span class="meta">#用GitHub的都知道</span></span><br></pre></td></tr></table></figure><p></p><p>如果你需要修改头部，直接修改hexo\themes\modernist\layout_partial\header.ejs，比如头上加个搜索框：<br></p><figure class="highlight erb"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br><span class="line">6</span><br></pre></td><td class="code"><pre><span class="line"><span class="xml"><span class="tag">&lt;<span class="name">div</span>&gt;</span></span></span><br><span class="line"><span class="xml"><span class="tag">&lt;<span class="name">form</span> <span class="attr">class</span>=<span class="string">"search"</span> <span class="attr">action</span>=<span class="string">"//google.com/search"</span> <span class="attr">method</span>=<span class="string">"get"</span> <span class="attr">accept-charset</span>=<span class="string">"utf-8"</span>&gt;</span></span></span><br><span class="line"><span class="xml"> <span class="tag">&lt;<span class="name">input</span> <span class="attr">type</span>=<span class="string">"search"</span> <span class="attr">name</span>=<span class="string">"q"</span> <span class="attr">id</span>=<span class="string">"search"</span> <span class="attr">autocomplete</span>=<span class="string">"off"</span> <span class="attr">autocorrect</span>=<span class="string">"off"</span> <span class="attr">autocapitalize</span>=<span class="string">"off"</span> <span class="attr">maxlength</span>=<span class="string">"20"</span> <span class="attr">placeholder</span>=<span class="string">"Search"</span> /&gt;</span></span></span><br><span class="line"><span class="xml"> <span class="tag">&lt;<span class="name">input</span> <span class="attr">type</span>=<span class="string">"hidden"</span> <span class="attr">name</span>=<span class="string">"q"</span> <span class="attr">value</span>=<span class="string">"site:&lt;%-</span></span></span><span class="ruby"> config.url.replace(<span class="regexp">/^https?:\/\//</span>, <span class="string">''</span>) </span><span class="xml"><span class="tag"><span class="string">%&gt;"</span>&gt;</span></span></span><br><span class="line"><span class="xml"><span class="tag">&lt;/<span class="name">form</span>&gt;</span></span></span><br><span class="line"><span class="xml"><span class="tag">&lt;/<span class="name">div</span>&gt;</span></span></span><br></pre></td></tr></table></figure><p></p><p>将如上代码加入即可，您需要修改css以便这个搜索框比较美观。</p><p>再如，你要修改页脚版权信息，直接编辑hexo\themes\modernist\layout_partial\footer.ejs。同理，你需要修改css，直接去修改对应位置的styl文件。</p><h2 id="统计"><a href="#统计" class="headerlink" title="统计"></a>统计</h2><p>页面上显示访问次数可以使用 <a href="http://busuanzi.ibruce.info/" target="_blank" rel="noopener">不蒜子</a>，两行代码即可搞定。</p><p>因Google Analytics偶尔被墙，故用百度统计，以modernist主题为例，介绍如何添加。<br>编辑文件hexo\themes\modernist_config.yml，增加配置选项：</p><figure class="highlight yaml"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><span class="line"><span class="attr">baidu_tongji:</span> <span class="literal">true</span></span><br></pre></td></tr></table></figure><p>新建文件hexo\themes\modernist\layout_partial\baidu_tongji.ejs，内容如下：</p><figure class="highlight erb"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br></pre></td><td class="code"><pre><span class="line"><span class="xml"><span class="tag">&lt;<span class="name">%</span></span></span><span class="ruby"> <span class="keyword">if</span> (theme.baidu_tongji)&#123; </span><span class="xml"><span class="tag">%&gt;</span></span></span><br><span class="line"><span class="xml"><span class="tag">&lt;<span class="name">script</span> <span class="attr">type</span>=<span class="string">"text/javascript"</span>&gt;</span></span></span><br><span class="line"><span class="xml">#你的百度统计代码</span></span><br><span class="line"><span class="xml"><span class="tag">&lt;/<span class="name">script</span>&gt;</span></span></span><br><span class="line"><span class="xml"><span class="tag">&lt;<span class="name">%</span></span></span><span class="ruby"> &#125; </span><span class="xml"><span class="tag">%&gt;</span></span></span><br></pre></td></tr></table></figure><p>注册并登录百度统计获取你的统计代码。</p><p>编辑文件hexo\themes\modernist\layout_partial\head.ejs，在『/head』之前增加：</p><figure class="highlight gcode"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><span class="line">&lt;<span class="meta">%</span>- partial<span class="comment">('baidu_tongji')</span> <span class="meta">%</span>&gt;</span><br></pre></td></tr></table></figure><p>重新生成并部署你的站点。</p><p>不出意外的话，在你的站点的每个页面的左上角都会看到一个恶心的百度LOGO。你只能在『百度统计首页-&gt;网站列表-&gt;获取代码-&gt;系统管理设置-&gt;统计图标设置-&gt;显示图标』，把那个勾去掉。百度真是恶心，我准备还是用Google Analytics。</p><h2 id="分享"><a href="#分享" class="headerlink" title="分享"></a>分享</h2><p>我没有添加分享，觉得这个不是很必要，导致页面看起来啰嗦。以加网为例介绍如何添加：</p><ul><li>在hexo\themes\modernist\layout_partial\post下新建jiathis.ejs文件。<br>注册加网获得你的分享代码，写入jiathis.ejs。</li><li>在hexo\themes\modernist\layout_partial\article.ejs中，添加&lt;%-partial(‘post/jiathis’)%&gt;。<br>-分享服务还可以使用如下企业提供的技术<a href="http://www.jiathis.com/" target="_blank" rel="noopener">加网</a>，<a href="http://www.bshare.cn/" target="_blank" rel="noopener">bShare</a>，<a href="http://share.baidu.com/" target="_blank" rel="noopener">百度分享</a>。</li></ul><p>网站图标</p><p>看一下hexo\themes\modernist\layout_partial\head.ejs，找到这句：</p><figure class="highlight routeros"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><span class="line">&lt;link <span class="attribute">rel</span>=<span class="string">"icon"</span> <span class="attribute">type</span>=<span class="string">"image/x-icon"</span> <span class="attribute">href</span>=<span class="string">"&lt;%- config.root %&gt;favicon.ico"</span>&gt;</span><br></pre></td></tr></table></figure><p>你懂的，将你的favicon.ico放到工程根目录下即可，也就是hexo\source目录。可以<a href="http://www.faviconer.com/" target="_blank" rel="noopener">在Faviconer</a>制作你的ico图标，国内有<a href="http://www.bitbug.net/" target="_blank" rel="noopener">比特虫</a>。</p><h2 id="自定义挂件"><a href="#自定义挂件" class="headerlink" title="自定义挂件"></a>自定义挂件</h2><p>除了默认已提供的挂件外，你还可以自定义自己的小挂件，在hexo\themes\modernist\layout_widget\下，新建自己的ejs文件，如myWidget.ejs，然后在配置文件hexo\themes\modernist_config.yml中配置。<br></p><figure class="highlight avrasm"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br></pre></td><td class="code"><pre><span class="line"><span class="symbol">widgets:</span></span><br><span class="line">  - myWidget</span><br></pre></td></tr></table></figure><p></p><p>用上述方法可以添加新浪微博小挂件。</p><ul><li>生成自己的微博组件。</li><li>添加hexo\themes\modernist\layout_widget\weibo.ejs文件。</li><li>配置hexo\themes\modernist_config.yml。<h2 id="插件"><a href="#插件" class="headerlink" title="插件"></a>插件</h2></li></ul><p>安装插件：<br></p><figure class="highlight sql"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><span class="line">npm <span class="keyword">install</span> &lt;<span class="keyword">plugin</span>-<span class="keyword">name</span>&gt; <span class="comment">--save</span></span><br></pre></td></tr></table></figure><p></p><p>启用插件：在*hexo_config.yml文件添加：<br></p><figure class="highlight dts"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br></pre></td><td class="code"><pre><span class="line"><span class="symbol">plugins:</span></span><br><span class="line">- <span class="params">&lt;plugin-name&gt;</span>  <span class="meta">#插件名</span></span><br></pre></td></tr></table></figure><p></p><p>升级插件：<br></p><figure class="highlight coffeescript"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><span class="line"><span class="built_in">npm</span> update</span><br></pre></td></tr></table></figure><p></p><p>卸载插件：<br></p><figure class="highlight sql"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><span class="line">npm <span class="keyword">uninstall</span> &lt;<span class="keyword">plugin</span>-<span class="keyword">name</span>&gt;</span><br></pre></td></tr></table></figure><p></p><p>RSS插件<br>将上述命令中的『plugin-name』，替换为hexo-generator-feed。一旦安装完成，你可以在配置显示你站点的RSS，文件路径\atom.xml。</p><p>你可以用rss作为迁移工具，用如下命令读取其他位置的rss：</p><figure class="highlight bash"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><span class="line">hexo migrate rss &lt;<span class="built_in">source</span>&gt;</span><br></pre></td></tr></table></figure><p>『source』是本地或网络文件路径。</p><p>Sitemap插件<br>将上述命令中的『plugin-name』，替换为hexo-generator-sitemap。你可以将你站点地图提交给搜索引擎，文件路径\sitemap.xml。</p><p>更多插件的安装方法，请参考<a href="https://github.com/hexojs/hexo/wiki/Plugins" target="_blank" rel="noopener">官方Wiki</a>。</p><p>如果你按照上述步骤做，但插件不起作用，没有生成atom.xml和sitemap.xml，也没有报错，那么你应该cd到你的hexo初始化目录，在该目录下重新安装插件，重试。</p><h2 id="迁移"><a href="#迁移" class="headerlink" title="迁移"></a>迁移</h2><p>hexo支持从其他类型站点迁移，如通用RSS，Jekyll，Octopress，WordPress等，这一部分我没试过。请参考官方文档Hexo Migration。</p><h2 id="搜索引擎"><a href="#搜索引擎" class="headerlink" title="搜索引擎"></a>搜索引擎</h2><p>你可以到<a href="http://www.sousuoyinqingtijiao.com/" target="_blank" rel="noopener">屈站长</a>提交你的站点给搜索引擎。其他内容如添加站点或页面的description，提交Sitemap，添加百度统计，Google Analytics等等，参考本文其他章节的内容，不再一一阐述。</p><h2 id="更新"><a href="#更新" class="headerlink" title="更新"></a>更新</h2><p>更新hexo：</p><figure class="highlight coffeescript"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><span class="line"><span class="built_in">npm</span> update -g hexo</span><br></pre></td></tr></table></figure><p>更新主题：<br></p><figure class="highlight bash"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br></pre></td><td class="code"><pre><span class="line"><span class="built_in">cd</span> themes/你的主题</span><br><span class="line">git pull</span><br></pre></td></tr></table></figure><p></p><p>更新插件：<br></p><figure class="highlight coffeescript"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><span class="line"><span class="built_in">npm</span> update</span><br></pre></td></tr></table></figure><p></p><p>干掉IE</p><p>Kill IE6 提示的javascript代码，请自行搜索。</p><h2 id="换机器"><a href="#换机器" class="headerlink" title="换机器"></a>换机器</h2><p>你要保留好自己的博客源码。换机器写博客，就只能使用各种网盘的同步功能，或者你把你的站点源文件提交到某代码托管服务器。另外，貌似这篇很牛逼，Hexo 服务器端布署及 Dropbox 同步。</p><p>我的办法是这样的，先在一个目录下做好Node+Git+Hexo的绿色环境，写个hexos.bat可以一键启动hexo工作台，把整个目录用Dropbox同步，这样随便在办公室或家的任何笔记本台式机都可以写博客，也不用处理什么文件拷贝备份的事情，非常爽。</p><h2 id="统计功能"><a href="#统计功能" class="headerlink" title="统计功能"></a>统计功能</h2><p>为hexo博客添加访问次数统计功能</p><p>其它</p><p>网站加速</p><p><a href="http://www.webluker.com/" target="_blank" rel="noopener">Webluker-CDN 网站加速 免费CDN DNS解析</a></p><p>Webluker-FAQ索引</p><p>网站监控</p><p><a href="http://www.jiankongbao.com/" target="_blank" rel="noopener">监控宝-网站监控 网页监控 服务器监控</a></p><p><a href="http://www.jiankongbao.com/faq" target="_blank" rel="noopener">监控宝-常见问题</a></p><h1 id="参考文献"><a href="#参考文献" class="headerlink" title="参考文献"></a>参考文献</h1><ul><li><p><a href="http://blog.netpi.me/%E5%AE%9E%E7%94%A8/hexo/" target="_blank" rel="noopener">hexo + github + 多说 来搭建免费博客</a></p></li><li><p><a href="http://www.jerryfu.net/post/search-engine-for-hexo-with-swiftype-v2.html" target="_blank" rel="noopener">利用swiftype为hexo添加站内搜索</a></p></li><li><p><a href="http://www.imys.net/20150513/wordpress-to-hexo.html#%E6%97%A0%E6%B3%95%E5%BC%80%E5%90%AFRSS%E5%92%8Csitemap" target="_blank" rel="noopener">博客搬迁记 - 从WordPress到Hexo</a></p></li><li><p><a href="http://www.tuicool.com/articles/umEBVfI" target="_blank" rel="noopener">在 hexo中无痛使用本地图片</a></p></li><li><p><a href="http://i.woblog.cn/2016/05/04/%E6%89%8B%E6%8A%8A%E6%89%8B%E6%95%99%E4%BD%A0%E4%BD%BF%E7%94%A8Travis%20CI%E8%87%AA%E5%8A%A8%E9%83%A8%E7%BD%B2%E4%BD%A0%E7%9A%84Hexo%E5%8D%9A%E5%AE%A2%E5%88%B0Github%E4%B8%8A/#more" target="_blank" rel="noopener">手把手教你使用Travis CI自动部署你的Hexo博客到Github上</a></p></li><li><p><a href="http://www.gfwsb.com/2016/use-sitemap-for-hexo/" target="_blank" rel="noopener">为Hexo博客生成sitemap</a></p></li></ul><ul><li><p><a href="http://www.5941740.cn/2016/02/19/%E4%BD%BF%E7%94%A8gulp%E7%B2%BE%E7%AE%80hexo%E5%8D%9A%E5%AE%A2%E4%BB%A3%E7%A0%81/" target="_blank" rel="noopener">使用gulp精简hexo博客代码</a></p></li><li><p><a href="http://chitanda.me/2015/11/03/multiple-git-pages-in-one-github-account/" target="_blank" rel="noopener">单个GitHub帐号下添加多个GitHub Pages的相关问题</a></p></li><li><p><a href="http://ibruce.info/2013/11/22/hexo-your-blog/" target="_blank" rel="noopener">hexo你的博客</a></p></li></ul><blockquote><p>本文首发于个人技术博客 <a href="https://liliuzhu.gitee.io/blog">https://liliuzhu.gitee.io/blog</a></p></blockquote></div><div><div id="reward-container"><div>坚持技术分享，您的支持将鼓励我继续努力！</div><button id="reward-button" disable="enable" onclick="var qr = document.getElementById(&quot;qr&quot;); qr.style.display = (qr.style.display === 'none') ? 'block' : 'none';">打赏</button><div id="qr" style="display:none"><div style="display:inline-block"><img src="/blog/uploads/wechatpay.jpg" alt="Luther Li 微信支付"><p>微信支付</p></div><div style="display:inline-block"><img src="/blog/uploads/alipay.jpg" alt="Luther Li 支付宝"><p>支付宝</p></div></div></div></div><div><ul class="post-copyright"><li class="post-copyright-author"><strong>本文作者： </strong>Luther Li</li><li class="post-copyright-link"><strong>本文链接：</strong> <a href="https://liliuzhu.gitee.io/blog/2019/03/gitpage+hexo_develop_blog.html" title="【基础】利用 hexo + Gitpage 开发自己的博客">https://liliuzhu.gitee.io/blog/2019/03/gitpage+hexo_develop_blog.html</a></li><li class="post-copyright-license"><strong>版权声明： </strong>本博客所有文章除特别声明外，均采用 <a href="https://creativecommons.org/licenses/by-nc-sa/4.0/deed.zh" rel="noopener" target="_blank"><i class="fa fa-fw fa-creative-commons"></i>BY-NC-SA</a> 许可协议。转载请注明出处！</li></ul></div><footer class="post-footer"><div class="post-tags"><a href="/blog/tags/Hexo建站/" rel="tag"># Hexo建站</a> <a href="/blog/tags/Githubpages/" rel="tag"># Githubpages</a></div><div class="post-widgets"><div class="social_share"><div><div class="bdsharebuttonbox"><a href="#" class="bds_tsina" data-cmd="tsina" title="分享到新浪微博"></a> <a href="#" class="bds_douban" data-cmd="douban" title="分享到豆瓣网"></a> <a href="#" class="bds_sqq" data-cmd="sqq" title="分享到QQ好友"></a> <a href="#" class="bds_qzone" data-cmd="qzone" title="分享到QQ空间"></a> <a href="#" class="bds_weixin" data-cmd="weixin" title="分享到微信"></a> <a href="#" class="bds_tieba" data-cmd="tieba" title="分享到百度贴吧"></a> <a href="#" class="bds_twi" data-cmd="twi" title="分享到Twitter"></a> <a href="#" class="bds_fbook" data-cmd="fbook" title="分享到Facebook"></a> <a href="#" class="bds_more" data-cmd="more"></a> <a class="bds_count" data-cmd="count"></a></div><script>window._bd_share_config={common:{bdText:"",bdMini:"2",bdMiniList:!1,bdPic:""},share:{bdSize:"16",bdStyle:"0"},image:{viewList:["tsina","douban","sqq","qzone","weixin","twi","fbook"],viewText:"分享到：",viewSize:"16"}}</script><script>with(document)(0)[(getElementsByTagName("head")[0]||body).appendChild(createElement("script")).src="/static/api/js/share.js?cdnversion="+~(-new Date/36e5)]</script></div></div></div><div class="post-nav"><div class="post-nav-next post-nav-item"><a href="/blog/2017/12/Intranet_mapping.html" rel="next" title="搭建可通过外网访问的内网服务器"><i class="fa fa-chevron-left"></i> 搭建可通过外网访问的内网服务器</a></div><span class="post-nav-divider"></span><div class="post-nav-prev post-nav-item"><a href="/blog/2019/04/JS-classicic-sorting-algorithms.html" rel="prev" title="JavaScript实现经典排序算法">JavaScript实现经典排序算法 <i class="fa fa-chevron-right"></i></a></div></div></footer></div></article></div></div><div class="comments" id="comments"></div></div><div class="sidebar-toggle"><div class="sidebar-toggle-line-wrap"><span class="sidebar-toggle-line sidebar-toggle-line-first"></span> <span class="sidebar-toggle-line sidebar-toggle-line-middle"></span> <span class="sidebar-toggle-line sidebar-toggle-line-last"></span></div></div><aside id="sidebar" class="sidebar"><div class="sidebar-inner"><ul class="sidebar-nav motion-element"><li class="sidebar-nav-toc sidebar-nav-active" data-target="post-toc-wrap">文章目录</li><li class="sidebar-nav-overview" data-target="site-overview-wrap">站点概览</li></ul><div class="site-overview-wrap sidebar-panel"><div class="site-overview"><div class="site-author motion-element" itemprop="author" itemscope itemtype="http://schema.org/Person"><img class="site-author-image" itemprop="image" src="/blog/uploads/avatar.jpg" alt="Luther Li"><p class="site-author-name" itemprop="name">Luther Li</p><div class="site-description motion-element" itemprop="description">本人前端菜鸟一枚，踏在前端这条不归路上<br>渐行渐远...</div></div><nav class="site-state motion-element"><div class="site-state-item site-state-posts"><a href="/blog/archives/"><span class="site-state-item-count">8</span> <span class="site-state-item-name">日志</span></a></div><div class="site-state-item site-state-categories"><a href="/blog/categories/"><span class="site-state-item-count">8</span> <span class="site-state-item-name">分类</span></a></div><div class="site-state-item site-state-tags"><a href="/blog/tags/"><span class="site-state-item-count">10</span> <span class="site-state-item-name">标签</span></a></div></nav><div class="feed-link motion-element"><a href="/blog/atom.xml" rel="alternate"><i class="fa fa-rss"></i> RSS</a></div><div class="links-of-author motion-element"><span class="links-of-author-item"><a href="https://github.com/liliuzhu" title="GitHub &rarr; https://github.com/liliuzhu" rel="noopener" target="_blank"><i class="fa fa-fw fa-github"></i>GitHub</a> </span><span class="links-of-author-item"><a href="mailto:liliuzhu1992@163.com" title="E-Mail &rarr; mailto:liliuzhu1992@163.com" rel="noopener" target="_blank"><i class="fa fa-fw fa-envelope"></i>E-Mail</a> </span><span class="links-of-author-item"><a href="http://blog.csdn.net/yuhouxinya" title="CSDN &rarr; http://blog.csdn.net/yuhouxinya" rel="noopener" target="_blank"><i class="fa fa-fw fa-book"></i>CSDN</a> </span><span class="links-of-author-item"><a href="https://juejin.im/user/58d69e3c44d904006870487f" title="掘金 &rarr; https://juejin.im/user/58d69e3c44d904006870487f" rel="noopener" target="_blank"><i class="fa fa-fw fa-book"></i>掘金</a> </span><span class="links-of-author-item"><a href="https://liliuzhu.gitee.io" title="个人主页 &rarr; https://liliuzhu.gitee.io"><i class="fa fa-fw fa-leaf"></i>个人主页</a></span></div><div class="links-of-blogroll motion-element links-of-blogroll-inline"><div class="links-of-blogroll-title"><i class="fa fa-fw fa-link"></i> 推荐阅读</div><ul class="links-of-blogroll-list"><li class="links-of-blogroll-item"><a href="http://www.uisdc.com/" title="http://www.uisdc.com/" rel="noopener" target="_blank">优设</a></li><li class="links-of-blogroll-item"><a href="http://www.zhangxinxu.com/" title="http://www.zhangxinxu.com/" rel="noopener" target="_blank">张鑫旭</a></li><li class="links-of-blogroll-item"><a href="http://www.alloyteam.com/nav/" title="http://www.alloyteam.com/nav/" rel="noopener" target="_blank">Web前端导航</a></li><li class="links-of-blogroll-item"><a href="http://www.36zhen.com/t?id=3448" title="http://www.36zhen.com/t?id=3448" rel="noopener" target="_blank">前端书籍资料</a></li><li class="links-of-blogroll-item"><a href="http://ife.baidu.com/" title="http://ife.baidu.com/" rel="noopener" target="_blank">百度前端技术学院</a></li><li class="links-of-blogroll-item"><a href="http://wf.uisdc.com/cn/" title="http://wf.uisdc.com/cn/" rel="noopener" target="_blank">google前端开发基础</a></li></ul></div></div></div><div class="post-toc-wrap motion-element sidebar-panel sidebar-panel-active"><div class="post-toc"><div class="post-toc-content"><ol class="nav"><li class="nav-item nav-level-2"><a class="nav-link" href="#Gitpage-hexo"><span class="nav-number">1.</span> <span class="nav-text">Gitpage+hexo</span></a></li></ol><li class="nav-item nav-level-1"><a class="nav-link" href="#环境准备"><span class="nav-number"></span> <span class="nav-text">环境准备</span></a><ol class="nav-child"><li class="nav-item nav-level-2"><a class="nav-link" href="#1-安装Node"><span class="nav-number">1.</span> <span class="nav-text">1 安装Node</span></a></li><li class="nav-item nav-level-2"><a class="nav-link" href="#2-安装Git"><span class="nav-number">2.</span> <span class="nav-text">2 安装Git</span></a></li></ol></li><li class="nav-item nav-level-1"><a class="nav-link" href="#安装步骤"><span class="nav-number"></span> <span class="nav-text">安装步骤</span></a><ol class="nav-child"><li class="nav-item nav-level-2"><a class="nav-link" href="#1-安装Hexo"><span class="nav-number">1.</span> <span class="nav-text">1 安装Hexo</span></a></li><li class="nav-item nav-level-2"><a class="nav-link" href="#2-安装博客所需文件"><span class="nav-number">2.</span> <span class="nav-text">2 安装博客所需文件</span></a></li><li class="nav-item nav-level-2"><a class="nav-link" href="#3-部署博客到服务器"><span class="nav-number">3.</span> <span class="nav-text">3 部署博客到服务器</span></a></li></ol></li><li class="nav-item nav-level-1"><a class="nav-link" href="#发表博文"><span class="nav-number"></span> <span class="nav-text">发表博文</span></a><ol class="nav-child"><li class="nav-item nav-level-2"><a class="nav-link" href="#新建博文"><span class="nav-number">1.</span> <span class="nav-text">新建博文</span></a></li><li class="nav-item nav-level-2"><a class="nav-link" href="#优雅的在博客上插入图片"><span class="nav-number">2.</span> <span class="nav-text">优雅的在博客上插入图片</span></a></li><li class="nav-item nav-level-2"><a class="nav-link" href="#预览和发表"><span class="nav-number">3.</span> <span class="nav-text">预览和发表</span></a></li><li class="nav-item nav-level-2"><a class="nav-link" href="#安装主题"><span class="nav-number">4.</span> <span class="nav-text">安装主题</span></a></li><li class="nav-item nav-level-2"><a class="nav-link" href="#安装Next主题"><span class="nav-number">5.</span> <span class="nav-text">安装Next主题</span></a></li><li class="nav-item nav-level-2"><a class="nav-link" href="#评论框"><span class="nav-number">6.</span> <span class="nav-text">评论框</span></a></li><li class="nav-item nav-level-2"><a class="nav-link" href="#构建新页面"><span class="nav-number">7.</span> <span class="nav-text">构建新页面</span></a></li><li class="nav-item nav-level-2"><a class="nav-link" href="#安装插件"><span class="nav-number">8.</span> <span class="nav-text">安装插件</span></a></li><li class="nav-item nav-level-2"><a class="nav-link" href="#图床"><span class="nav-number">9.</span> <span class="nav-text">图床</span></a></li><li class="nav-item nav-level-2"><a class="nav-link" href="#主题优化"><span class="nav-number">10.</span> <span class="nav-text">主题优化</span></a></li><li class="nav-item nav-level-2"><a class="nav-link" href="#绑定域名"><span class="nav-number">11.</span> <span class="nav-text">绑定域名</span></a></li><li class="nav-item nav-level-2"><a class="nav-link" href="#制作ICO图标"><span class="nav-number">12.</span> <span class="nav-text">制作ICO图标</span></a></li><li class="nav-item nav-level-2"><a class="nav-link" href="#修改局部页面"><span class="nav-number">13.</span> <span class="nav-text">修改局部页面</span></a></li><li class="nav-item nav-level-2"><a class="nav-link" href="#统计"><span class="nav-number">14.</span> <span class="nav-text">统计</span></a></li><li class="nav-item nav-level-2"><a class="nav-link" href="#分享"><span class="nav-number">15.</span> <span class="nav-text">分享</span></a></li><li class="nav-item nav-level-2"><a class="nav-link" href="#自定义挂件"><span class="nav-number">16.</span> <span class="nav-text">自定义挂件</span></a></li><li class="nav-item nav-level-2"><a class="nav-link" href="#插件"><span class="nav-number">17.</span> <span class="nav-text">插件</span></a></li><li class="nav-item nav-level-2"><a class="nav-link" href="#迁移"><span class="nav-number">18.</span> <span class="nav-text">迁移</span></a></li><li class="nav-item nav-level-2"><a class="nav-link" href="#搜索引擎"><span class="nav-number">19.</span> <span class="nav-text">搜索引擎</span></a></li><li class="nav-item nav-level-2"><a class="nav-link" href="#更新"><span class="nav-number">20.</span> <span class="nav-text">更新</span></a></li><li class="nav-item nav-level-2"><a class="nav-link" href="#换机器"><span class="nav-number">21.</span> <span class="nav-text">换机器</span></a></li><li class="nav-item nav-level-2"><a class="nav-link" href="#统计功能"><span class="nav-number">22.</span> <span class="nav-text">统计功能</span></a></li></ol></li><li class="nav-item nav-level-1"><a class="nav-link" href="#参考文献"><span class="nav-number"></span> <span class="nav-text">参考文献</span></a></li></div></div></div></div></aside></div></main><footer id="footer" class="footer"><div class="footer-inner"><div class="copyright">&copy; <span itemprop="copyrightYear">2020</span> <span class="with-love" id="animate"><i class="fa fa-user"></i> </span><span class="author" itemprop="copyrightHolder">Luther Li</span> <span class="post-meta-divider">|</span> <span class="post-meta-item-icon"><i class="fa fa-area-chart"></i> </span><span class="post-meta-item-text">站点总字数：</span> <span title="站点总字数">57k</span></div><div class="busuanzi-count"><script async src="https://busuanzi.ibruce.info/busuanzi/2.3/busuanzi.pure.mini.js"></script><span class="post-meta-item-icon"><i class="fa fa-user"></i> </span><span class="site-uv" title="总访客量"><span class="busuanzi-value" id="busuanzi_value_site_uv"></span> </span><span class="post-meta-divider">|</span> <span class="post-meta-item-icon"><i class="fa fa-eye"></i> </span><span class="site-pv" title="总访问量"><span class="busuanzi-value" id="busuanzi_value_site_pv"></span></span></div></div></footer><div class="back-to-top"><i class="fa fa-arrow-up"></i> <span id="scrollpercent"><span>0</span>%</span></div></div><script>"[object Function]"!==Object.prototype.toString.call(window.Promise)&&(window.Promise=null)</script><script color="0,0,255" opacity="0.5" zindex="10" count="99" src="//cdn.bootcss.com/canvas-nest.js/1.0.0/canvas-nest.min.js"></script><script src="/blog/lib/jquery/index.js?v=2.1.3"></script><script src="//cdn.bootcss.com/fastclick/1.0.6/fastclick.min.js"></script><script src="//cdn.bootcss.com/jquery_lazyload/1.9.7/jquery.lazyload.min.js"></script><script src="/blog/lib/velocity/velocity.min.js?v=1.2.1"></script><script src="/blog/lib/velocity/velocity.ui.min.js?v=1.2.1"></script><script src="//cdn.bootcss.com/fancybox/3.5.6/jquery.fancybox.min.js"></script><script src="/blog/js/utils.js?v=7.1.2"></script><script src="/blog/js/motion.js?v=7.1.2"></script><script src="/blog/js/affix.js?v=7.1.2"></script><script src="/blog/js/schemes/pisces.js?v=7.1.2"></script><script src="/blog/js/scrollspy.js?v=7.1.2"></script><script src="/blog/js/post-details.js?v=7.1.2"></script><script src="/blog/js/next-boot.js?v=7.1.2"></script><script src="//cdn.jsdelivr.net/npm/leancloud-storage@3/dist/av-min.js"></script><script src="//cdn.jsdelivr.net/npm/valine@1/dist/Valine.min.js"></script><script>var GUEST=["nick","mail","link"],guest="nick,mail,link";guest=guest.split(",").filter(function(e){return GUEST.indexOf(e)>-1}),new Valine({el:"#comments",verify:!1,notify:!1,appId:"fIXqVCTX6VryzoR8ENkLXThu-gzGzoHsz",appKey:"nvWdXA0OQKn58RCTSMmd5JAK",placeholder:"欢迎交流讨论...",avatar:"mm",meta:guest,pageSize:"10",visitor:!0,lang:"zh-cn"})</script><script>function proceedsearch(){$("body").append('<div class="search-popup-overlay local-search-pop-overlay"></div>').css("overflow","hidden"),$(".search-popup-overlay").click(onPopupClose),$(".popup").toggle();var e=$("#local-search-input");e.attr("autocapitalize","none"),e.attr("autocorrect","off"),e.focus()}var isfetched=!1,isXml=!0,search_path="search.xml";0===search_path.length?search_path="search.xml":/json$/i.test(search_path)&&(isXml=!1);var path="/blog/"+search_path,onPopupClose=function(e){$(".popup").hide(),$("#local-search-input").val(""),$(".search-result-list").remove(),$("#no-result").remove(),$(".local-search-pop-overlay").remove(),$("body").css("overflow","")},searchFunc=function(e,t,o){"use strict";$("body").append('<div class="search-popup-overlay local-search-pop-overlay"><div id="search-loading-icon"><i class="fa fa-spinner fa-pulse fa-5x fa-fw"></i></div></div>').css("overflow","hidden"),$("#search-loading-icon").css("margin","20% auto 0 auto").css("text-align","center"),$.ajax({url:e,dataType:isXml?"xml":"json",async:!0,success:function(e){isfetched=!0,$(".popup").detach().appendTo(".header-inner");var n=isXml?$("entry",e).map(function(){return{title:$("title",this).text(),content:$("content",this).text(),url:$("url",this).text()}}).get():e,r=document.getElementById(t),s=document.getElementById(o),a=function(){var e=r.value.trim().toLowerCase(),t=e.split(/[\s\-]+/);t.length>1&&t.push(e);var o=[];if(e.length>0&&n.forEach(function(n){function r(t,o,n,r){for(var s=r[r.length-1],a=s.position,i=s.word,l=[],h=0;a+i.length<=n&&0!=r.length;){i===e&&h++,l.push({position:a,length:i.length});var p=a+i.length;for(r.pop();0!=r.length&&(s=r[r.length-1],a=s.position,i=s.word,p>a);)r.pop()}return c+=h,{hits:l,start:o,end:n,searchTextCount:h}}function s(e,t){var o="",n=t.start;return t.hits.forEach(function(t){o+=e.substring(n,t.position);var r=t.position+t.length;o+='<b class="search-keyword">'+e.substring(t.position,r)+"</b>",n=r}),o+=e.substring(n,t.end)}var a=!1,i=0,c=0,l=n.title.trim(),h=l.toLowerCase(),p=n.content.trim().replace(/<[^>]+>/g,""),u=p.toLowerCase(),f=decodeURIComponent(n.url).replace(/\/{2,}/g,"/"),d=[],g=[];if(""!=l&&(t.forEach(function(e){function t(e,t,o){var n=e.length;if(0===n)return[];var r=0,s=[],a=[];for(o||(t=t.toLowerCase(),e=e.toLowerCase());(s=t.indexOf(e,r))>-1;)a.push({position:s,word:e}),r=s+n;return a}d=d.concat(t(e,h,!1)),g=g.concat(t(e,u,!1))}),(d.length>0||g.length>0)&&(a=!0,i=d.length+g.length)),a){[d,g].forEach(function(e){e.sort(function(e,t){return t.position!==e.position?t.position-e.position:e.word.length-t.word.length})});var v=[];0!=d.length&&v.push(r(l,0,l.length,d));for(var $=[];0!=g.length;){var C=g[g.length-1],m=C.position,x=C.word,w=m-20,y=m+80;w<0&&(w=0),y<m+x.length&&(y=m+x.length),y>p.length&&(y=p.length),$.push(r(p,w,y,g))}$.sort(function(e,t){return e.searchTextCount!==t.searchTextCount?t.searchTextCount-e.searchTextCount:e.hits.length!==t.hits.length?t.hits.length-e.hits.length:e.start-t.start});var T=parseInt("1");T>=0&&($=$.slice(0,T));var b="";b+=0!=v.length?"<li><a href='"+f+"' class='search-result-title'>"+s(l,v[0])+"</a>":"<li><a href='"+f+"' class='search-result-title'>"+l+"</a>",$.forEach(function(e){b+="<a href='"+f+'\'><p class="search-result">'+s(p,e)+"...</p></a>"}),b+="</li>",o.push({item:b,searchTextCount:c,hitCount:i,id:o.length})}}),1===t.length&&""===t[0])s.innerHTML='<div id="no-result"><i class="fa fa-search fa-5x"></i></div>';else if(0===o.length)s.innerHTML='<div id="no-result"><i class="fa fa-frown-o fa-5x"></i></div>';else{o.sort(function(e,t){return e.searchTextCount!==t.searchTextCount?t.searchTextCount-e.searchTextCount:e.hitCount!==t.hitCount?t.hitCount-e.hitCount:t.id-e.id});var a='<ul class="search-result-list">';o.forEach(function(e){a+=e.item}),a+="</ul>",s.innerHTML=a}};r.addEventListener("input",a),$(".local-search-pop-overlay").remove(),$("body").css("overflow",""),proceedsearch()}})};$(".popup-trigger").click(function(e){e.stopPropagation(),isfetched===!1?searchFunc(path,"local-search-input","local-search-result"):proceedsearch()}),$(".popup-btn-close").click(onPopupClose),$(".popup").click(function(e){e.stopPropagation()}),$(document).on("keyup",function(e){var t=27===e.which&&$(".search-popup").is(":visible");t&&onPopupClose()})</script><script>!function(){var t=document.createElement("script"),e=window.location.protocol.split(":")[0];t.src="https"===e?"https://zz.bdstatic.com/linksubmit/push.js":"http://push.zhanzhang.baidu.com/push.js";var s=document.getElementsByTagName("script")[0];s.parentNode.insertBefore(t,s)}()</script><script type="text/javascript" src="/blog/js/core_socialist_values.js"></script><script src="/blog/live2d/lib/L2Dwidget.min.js?094cbace49a39548bed64abff5988b05"></script><script>L2Dwidget.init({pluginRootPath:"live2d/",pluginJsPath:"lib/",pluginModelPath:"assets/",tagMode:!1,debug:!1,model:{jsonPath:"/blog/live2d/assets/assets/haru02.model.json"},display:{position:"left",superSample:1,width:150,height:300,hOffset:10,vOffset:10},mobile:{show:!0},react:{opacityDefault:1,opacityOnHover:.2},log:!1})</script></body></html><!-- rebuild by neat -->